<template>
  <!-- 服务须知 -->
  <view class="care-evaluate" :id="'tab' + tabInfoArray[0].id">
    <text class="care-evaluate-header">用户评价</text>
    <view class="care-evaluate-body">
      <view class="evaluate-user-info">
        <image class="user-avator" src="@/static/logo.png" mode="scaleToFill" />
        <view class="user-name-item">
          <view class="user-item-info">
            <text class="name">张三</text>
            <uni-rate size="18" :value="5" />
          </view>
          <view class="user-tag">
            <text class="tag-size">态度好</text>
            <text class="tag-size">效率高</text>
          </view>
        </view>
      </view>

      <view class="evaluate-text-info">
        <text>阿姨照顾的很好，很用心，照顾的很不错，两个人也聊的很开心</text>
      </view>

      <view class="evaluate-text-image">
        <image class="evaluate-image-size" src="@/static/images/defAvator.png" mode="scaleToFill" />
      </view>
    </view>
  </view>
</template>

<script setup></script>
<style scoped lang="scss">
.care-evaluate {
  margin-top: 20rpx;
  padding: 20rpx 20rpx;
  background-color: #ffffff;
  overflow: scroll;

  .care-evaluate-body {
    background-color: #f7f7f7;
    border-radius: 22rpx;
    padding: 20rpx;
    margin-top: 20rpx;
    .evaluate-user-info {
      display: flex;
      .user-avator {
        width: 100rpx;
        height: 100rpx;
        border-radius: 50%;
      }
      .user-name-item {
        padding-left: 20rpx;
        .user-item-info {
          display: flex;
          align-items: center;
          .name {
            padding-right: 10rpx;
          }
        }
        .user-tag {
          font-size: 28rpx;
          padding-top: 20rpx;
          .tag-size {
            padding: 4rpx;
            border-radius: 10rpx;
            border: 1rpx solid #898989;
            margin-right: 10rpx;
          }
        }
      }
    }
    .evaluate-text-info {
      padding: 20rpx 0;
      font-size: 32rpx;
    }

    .evaluate-text-image {
      padding-top: 20rpx;
      .evaluate-image-size {
        width: 160rpx;
        height: 160rpx;

        margin-left: 10rpx;
        border-radius: 10rpx 10rpx;
      }
    }
  }
}
</style>
